<template>
	<view>
		<view class="page">
			<image src="http://jiaoyukehu.oss-cn-beijing.aliyuncs.com/static/nursery/index/bg.png" mode="" class="bg"></image>
		</view>
		<view class="title">小程序名称</view>
		<banner :bannerList='bannerList'></banner>
		<notice></notice>
		<list></list>
		<bottom type="nursery" :tabIndex="0"></bottom>
	</view>
</template>

<script lang="ts" setup>
	//引入
	import { ref } from 'vue';
	import banner from '@/components/nursery/tabbar/index/banner/banner.vue';
	import notice from '@/components/nursery/tabbar/index/notice/notice.vue';
	import list from '@/components/nursery/tabbar/index/list/list.vue';
	import bottom from '@/components/footer/footer.vue';
	const bannerList = ref([
		'https://img0.baidu.com/it/u=2022043590,1237511079&fm=253&fmt=auto&app=120&f=JPEG?w=889&h=500',
		'https://img0.baidu.com/it/u=3001422767,55637664&fm=253&fmt=auto&app=120&f=JPEG?w=1200&h=791',
		'https://img0.baidu.com/it/u=1385079478,4019721997&fm=253&fmt=auto&app=138&f=JPEG?w=889&h=500'
	]);
</script>

<style lang="scss" scoped>
	.page{
		width: 100%;
		background-color: $uni-bg-color-grey;
		min-height: 100vh;
		position: absolute;
		z-index: -1;
		top: 0;left: 0;
		.bg{
			width: 100%;
			height: mp-sizing(236);
		}
	}
	.title{
		font-size: mp-sizing(22);
		font-weight: 500;
		padding: mp-sizing(15) mp-sizing(20);
	}
</style>